<template>
  <div>
        <section class="menu-block">
            <h2>base64图片保存到本地临时文件夹</h2>
            <div class="menu-block">
                <pre v-highlightA>
                    <code>
import {file} from 'fzHybrid'
...
//此api为base64图片保存到本地临时文件夹
//返回结果success:true/false,filePath:(成功后本地的存储路径)
file.saveImgToTemp(
    base64Str: '',
    fileName: '',
    function(info){}
)

                    </code>
                </pre>
                <van-cell-group>
                    <van-field v-model="saveImgToTempBase64Str" label="base64Str" placeholder="请输入若干字符" />
                    <van-field v-model="saveImgToTempFileName" label="fileName" placeholder="请输入若干字符" />
                </van-cell-group>
                <van-button size="large" type="primary" @click="saveImgToTempClick">点击保存</van-button>
                <code>返回结果：{{ saveImgToTempResult }}</code>
            </div>
        </section>
        <section class="menu-block">
            <h2>base64图片保存到本地相册系统</h2>
            <div class="menu-block">
                <pre v-highlightA>
                    <code>
import {file} from 'fzHybrid'
...
//此api为base64图片保存到本地相册系统
//返回结果success:true/false,filePath:(成功后本地的存储路径)
file.saveImgToPhotosAlbum(
    base64Str: '',
    fileName: '',
    function(info){}
)

                    </code>
                </pre>
                <van-cell-group>
                    <van-field v-model="saveImgToPhotosAlbumBase64Str" label="base64Str" placeholder="请输入若干字符" />
                    <van-field v-model="saveImgToPhotosAlbumFileName" label="fileName" placeholder="请输入若干字符" />
                </van-cell-group>
                <van-button size="large" type="primary" @click="saveImgToPhotosAlbumClick">点击保存</van-button>
                <code>返回结果：{{ saveImgToPhotosAlbumResult }}</code>
            </div>
        </section>
        <section class="menu-block">
            <h2>网络图片保存到本地临时文件夹</h2>
            <div class="menu-block">
                <pre v-highlightA>
                    <code>
import {file} from 'fzHybrid'
...
//此api为网络图片保存到本地临时文件夹
//返回结果success:true/false,filePath:(成功后本地的存储路径)
file.downloadImgToTemp(
    url: '',
    function(info){}
)

                    </code>
                </pre>
                <van-cell-group>
                    <van-field v-model="downloadImgToTempUrl" label="url" placeholder="请输入若干字符" />
                </van-cell-group>
                <van-button size="large" type="primary" @click="downloadImgToTempClick">点击保存</van-button>
                <code>返回结果：{{ downloadImgToTempResult }}</code>
            </div>
        </section>
        <section class="menu-block">
            <h2>网络图片保存到本地系统相册</h2>
            <div class="menu-block">
                <pre v-highlightA>
                    <code>
import {file} from 'fzHybrid'
...
//此api为网络图片保存到本地系统相册
//返回结果success:true/false,filePath:(成功后本地的存储路径)
file.downImgToPhotosAlbum(
    url: '',
    function(info){}
)

                    </code>
                </pre>
                <van-cell-group>
                    <van-field v-model="downImgToPhotosAlbumUrl" label="url" placeholder="请输入若干字符" />
                </van-cell-group>
                <van-button size="large" type="primary" @click="downImgToPhotosAlbumClick">点击保存</van-button>
                <code>返回结果：{{ downImgToPhotosAlbumResult }}</code>
            </div>
        </section>
  </div>
</template>

<script>
import {Button, CellGroup, Cell, Field, Notify} from 'vant'
import {file} from 'MTHybrid'

export default {
    data () {
        return {
            saveImgToTempBase64Str: '',
            saveImgToTempFileName: '',
            saveImgToPhotosAlbumBase64Str: '',
            saveImgToPhotosAlbumFileName: '',
            downloadImgToTempUrl: '',
            downImgToPhotosAlbumUrl: '',
            saveImgToTempResult: '',
            saveImgToPhotosAlbumResult: '',
            downloadImgToTempResult: '',
            downImgToPhotosAlbumResult: ''
        }
    },
    methods: {

        saveImgToTempClick () {
            var thiz = this
            file.saveImgToTemp(this.saveImgToTempBase64Str, this.saveImgToTempFileName, function (info) {
                thiz.saveImgToTempResult = info
            })
        },

        saveImgToPhotosAlbumClick () {
            var thiz = this
            file.saveImgToPhotosAlbum(this.saveImgToPhotosAlbumBase64Str, this.saveImgToPhotosAlbumFileName, function (info) {
                thiz.saveImgToPhotosAlbumResult = info
            })
        },

        downloadImgToTempClick () {
            var thiz = this
            file.downloadImgToTemp(this.downloadImgToTempUrl, function (info) {
                thiz.downloadImgToTempResult = info
            })
        },

        downImgToPhotosAlbumClick () {
            var thiz = this
            file.downloadImgToPhotosAlbum(this.downImgToPhotosAlbumUrl, function (info) {
                thiz.saveImgToPhotosAlbumResult = info
            })
        }

    },
    components: {
        [Button.name]: Button,
        [Cell.name]: Cell,
        [CellGroup.name]: CellGroup,
        [Field.name]: Field,
        [Notify.name]: Notify
    }
}
</script>

<style>
    @import '../../../static/css/index.css';
    .menu-block {
        padding: 0 0.2rem
    }
    h2 {
        margin-block-start: 0.83em;
        margin-block-end: 0.83em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
        margin: 0;
        /* font-weight: 200; */
        font-size: 18px;
        color: rgba(69,90,100,.6);
        padding: 20px 15px 15px;
    }
</style>
